
// 获取文章类别
function getCates() {
  axios({
    url: 'http://api-breakingnews-web.itheima.net/my/article/cates',
    headers: { 'Authorization': localStorage.getItem('token') },
    method: 'get',
  }).then(res => {
    console.log(res);
    if (res.data.status === 0) {
      res.data.data.forEach((obj, index) => {
        const theOpt = `<option value="${obj.Id}" lay-verify="cate">${obj.name}</option>`
        $('select[name="cate_id"]').append(theOpt)

        //手动的调用一个方法,去更新渲染 
        const form = layui.form
        // const { form } = layui 
        form.render('select', 'edit')
      });
    }
  })
}
getCates()



/*
POST请求
url  /my/article/add

FormData格式

title	是	string	文章标题
cate_id	是	int	所属分类 Id
content	是	string	文章内容
cover_img	是	blob二进制	文章封面
state	是	string	状态，可选值为：已发布、草稿
*/
let file = ''
// 给当前表单注册submit事件
$('form').on('submit', function (e) {
  e.preventDefault()
  // 后台需要什么数据  === 什么类型的  
  if (!file) return layer.msg('请先上传图片~')

  // 方式一
  // new FormData(form原生对象)

  // 方式二:
  // const fd = new FormData()  // 实现上传文件  (表单序列化)
  // fd 空 ===> img '11.png'
  // fd.append('img','11.png') 添加
  // cover_img ""
  // fd.set('cover_img','值')   设置



  const fd = new FormData($('form')[0])

  // fd.forEach((key,value)=>{

  // })

  // 富文本里的东西取出(唯一的用activeEditor)
  const htmlStr = tinyMCE.activeEditor.getContent();

  // append() 添加  0 - 1 formdata的中没有这样的属性
  // set  重新设置 formdata的值
  fd.set('content', htmlStr)

  fd.append('cover_img', file)

  axios({
    url: 'http://api-breakingnews-web.itheima.net/my/article/add',
    data: fd,
    headers: { 'Authorization': localStorage.getItem('token') },
    method: 'post'
  }).then(res => {
    console.log(res);
    layer.msg(res.data.message)
    if (res.data.status === 0) {
      // button 添加一个disabled属性
      $('.submit').attr('disabled', true)

      setTimeout(() => {
        // 调用父window身上的方法 addClass
        // window.parent.addClass()

        // 主动触发事件
        window.parent.$('#wzlist a').click()

        location.href = './../list/list.html'
      }, 800);
    }
  })
})



// 选择图片
$('.select').on('click', function () {
  // 触发input的点击事件
  $('#file').click()
})

// 监听input change事件

$('#file').on('change', function (e) {
  console.log(e.target.files);
  if (e.target.files.length === 0) return

  file = e.target.files[0]  

  // 实现预览 借助以window.URL...
  const url = window.URL.createObjectURL(file)
  console.log(url);

  // 设置图片的src
  $('#image').prop('src', url)

})


initEditor()  // 初始化 富文本编辑器

const form = layui.form
form.verify({
  articleTitle: [
    /^[\u4E00-\u9FA5a-zA-Z0-9_-]+$/,
    "标题只能是中英文, 数字下划线中划线组成"
  ],
  // 分类判断
  cate: function () {
    return $("select[name=cate_id]").val().length == 0 && "请选择文章类别"
  }
})